<!DOCTYPE html>
<!-- saved from url=(0029)http://my.sto.cn/Branch/Index -->
<html>
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
    <meta name="renderer" content="webkit|ie-comp|ie-stand">
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
    <meta http-equiv="X-UA-Compatible" content="IE=9; IE=8;">

    <script src="/admin/js/jquery.min.js"></script>
    <script src="/home/branch/js/jquery.cookie.js"></script>
    <script src="/home/js/city-picker.data.js"></script>
    <script src="/home/branch/js/city-picker.js"></script>

    <script type="text/javascript" src="/home/js/msg.js"></script>

    <link rel="stylesheet" type="text/css" href="/home/branch/css/index.css">
    <link rel="stylesheet" type="text/css" href="/home/branch/css/common.css">
    <link rel="stylesheet" type="text/css" href="/home/branch/css/styles.css">
    <link rel="stylesheet" type="text/css" href="/home/branch/css/city-picker.css">
    <link rel="stylesheet" type="text/css" href="/home/layui/css/layui.css">

    <style>
        .layui-laypage .layui-laypage-curr .layui-laypage-em {
            position: absolute;
            left: -1px;
            top: -1px;
            padding: 1px;
            width: 100%;
            height: 100%;
            background-color: #F08C48;
        }
    </style>
</head>
<body>
<#setting datetime_format="yyyy-MM-dd"/>
<#--<#include "../common/header.ftl">
<#include "../common/top_nav.ftl">-->

<div class="box" style="min-height:800px;">
    <div id="app">
        <div class="apply-site-container flex">
            <ul role="menubar" class="apply-site-menu el-menu">
                <li role="menuitem" tabindex="-1" class="el-menu-item <#--is-active-->" style="padding-left: 20px;"
                    onclick="showApplyFor()" id="showApplyFor">
                    <i style="margin-left: 10px" class="layui-icon layui-icon-form"></i>
                    <span>网点添加</span>
                </li>
                <li role="menuitem" tabindex="-1" class="el-menu-item " style="padding-left: 20px;"
                    onclick="showRecordBox()" id="showRecordBox">
                    <i style="margin-left: 10px" class="layui-icon layui-icon-ok-circle"></i>
                    <span>申请记录</span>
                </li>
            </ul>
            <#--网点申请开始-->
            <div class="apply-site-main" id="applyForBox">
                <section class="apply-site-section">
                    <h3 class="apply-site-title">网点信息</h3>
                    <form class="layui-form" id="applyForForm" style="margin: 70px">
                        <div class="layui-form-item">
                            <div class="layui-inline">
                                <label class="layui-form-label">网点名称:</label>
                                <div class="layui-input-inline">
                                    <input type="text" name="branchName" id="branchName" class="layui-input">
                                </div>
                            </div>
                            <div class="layui-inline">
                                <label class="layui-form-label">网点类型:</label>
                                <div class="layui-input-inline">
                                    <select name="branchType" id="branchType">
                                        <option value="">----请选择----</option>
                                        <#list branchTypes as branchType>
                                            <option value="${branchType}">${branchType.getName()}</option>
                                        </#list>
                                    </select>
                                </div>
                            </div>
                        </div>
                        <div class="layui-form-item">
                            <div class="layui-inline">
                                <label class="layui-form-label">管理员姓名:</label>
                                <div class="layui-input-inline">
                                    <input type="text" name="adminName" id="adminName" class="layui-input">
                                </div>
                            </div>
                            <div class="layui-inline">
                                <label class="layui-form-label">身份证号:</label>
                                <div class="layui-input-inline">
                                    <input type="text" name="idCard" id="idCard" class="layui-input">
                                </div>
                            </div>
                        </div>
                        <div class="layui-form-item">
                            <div class="layui-inline">
                                <label class="layui-form-label">手机号:</label>
                                <div class="layui-input-inline">
                                    <input type="text" name="mobile" id="mobile" class="layui-input">
                                </div>
                            </div>
                            <div class="layui-inline">
                                <label class="layui-form-label">查询电话:</label>
                                <div class="layui-input-inline">
                                    <input type="text" name="queryPhone" id="queryPhone" class="layui-input">
                                </div>
                            </div>
                        </div>
                        <div class="layui-form-item">
                            <div class="layui-inline">
                                <label class="layui-form-label">省市区</label>
                                <div class="layui-input-inline">
                                    <input name="address" data-toggle="city-picker" type="text" readonly="readonly"
                                           placeholder="请选择省市区" id="address" class="layui-input" autocomplete="off">
                                </div>
                            </div>
                            <div class="layui-inline">
                                <label class="layui-form-label">办公地址</label>
                                <div class="layui-input-inline">
                                    <input type="text" name="officeAddress" id="officeAddress" class="layui-input">
                                </div>
                            </div>
                        </div>
                        <div class="layui-form-item">
                            <div class="layui-inline">
                                <label class="layui-form-label">经纬度</label>
                                <div class="layui-input-inline">
                                    <input type="text" name="longitudeAndIatitude" id="longitudeAndIatitude"
                                           class="layui-input">
                                </div>
                            </div>
                            <div class="layui-inline">
                                <div class="layui-input-inline">
                                    <div style="margin-left: 36px">
                                        <a href="http://api.map.baidu.com/lbsapi/getpoint/index.html"
                                           target="_blank">百度地图经纬度拾取系统</a>
                                    </div>
                                </div>
                            </div>
                        </div>
                        <footer class="apply-site-footer">
                            <div class="layui-form-item">
                                <div class="layui-input-block">
                                    <button class="layui-btn" id="applyFor" style="background-color: #F08C48"
                                            lay-submit lay-filter="*">立即提交
                                    </button>
                                    <button type="reset" class="layui-btn layui-btn-primary">重置</button>
                                </div>
                            </div>
                        </footer>
                    </form>
                </section>
            </div>
            <#--网点申请结束-->

            <#--申请记录开始-->
            <div class="apply-site-main" id="recordBox" style="display: none">
                <section class="apply-site-section">
                    <h3 class="apply-site-title">申请记录</h3>
                    <div class="apply-history-content">
                        <div class="el-table el-table--fit el-table--enable-row-hover">
                            <div class="el-table__header-wrapper">
                                <table cellspacing="0" cellpadding="0" border="0"
                                       class="el-table__header" style="width: 900px;">
                                    <thead class="has-gutter">
                                    <tr class="">
                                        <th colspan="1" rowspan="1" class="el-table_2_column_9 is-leaf">
                                            <div class="cell">审批结果</div>
                                        </th>
                                        <th colspan="1" rowspan="1" class="el-table_2_column_10 is-leaf">
                                            <div class="cell">管理员姓名</div>
                                        </th>
                                        <th colspan="1" rowspan="1" class="el-table_2_column_11 is-leaf">
                                            <div class="cell">手机号</div>
                                        </th>
                                        <th colspan="1" rowspan="1" class="el-table_2_column_12 is-leaf">
                                            <div class="cell">网点名称</div>
                                        </th>
                                        <th colspan="1" rowspan="1" class="el-table_2_column_13 is-leaf">
                                            <div class="cell">网点类型</div>
                                        </th>
                                        <th colspan="1" rowspan="1" class="el-table_2_column_14 is-leaf">
                                            <div class="cell">申请时间</div>
                                        </th>
                                        <th colspan="1" rowspan="1" class="el-table_2_column_16 is-leaf">
                                            <div class="cell">操作</div>
                                        </th>
                                        <th class="gutter" style="width: 0px; display: none;"></th>
                                    </tr>
                                    </thead>
                                </table>

                            </div>

                            <div class="el-table__body-wrapper is-scrolling-none">
                                <#if pageBean.content ??>
                                    <#if pageBean.content?size gt 0>
                                        <table cellspacing="0" cellpadding="0" border="0" class="el-table__body"
                                               style="width: 900px;">
                                            <tbody>
                                            <#list pageBean.content as branchApplyFor>
                                                <tr>
                                                    <td>${branchApplyFor.getBranchApplyForStatus().getName()}</td>
                                                    <td>${branchApplyFor.adminName}</td>
                                                    <td>${branchApplyFor.mobile}</td>
                                                    <td>${branchApplyFor.branchName}</td>
                                                    <td>${branchApplyFor.getBranchType().getName()}</td>
                                                    <td>${branchApplyFor.createTime}</td>
                                                    <#if branchApplyFor.getBranchApplyForStatus().getCode() == 0>
                                                        <td class="tablelOperate">
                                                            <p><a href="javascript:void(0)" style="color: #ed6c00"
                                                                  onclick="lookInfo()">信息</a>
                                                            </p>
                                                        </td>
                                                    <#elseif branchApplyFor.getBranchApplyForStatus().getCode() == 2>
                                                        <td class="tablelOperate">
                                                            <p><a href="javascript:void(0)" style="color: #ed6c00"
                                                                  onclick="lookRejectReason('${branchApplyFor.rejectReason!""}')">驳回原因</a>
                                                            </p>
                                                            <HR style="FILTER: alpha(opacity=100,finishopacity=0,style=3)"
                                                                width="80%" color=#987cb9 SIZE=3>
                                                            <p style="margin-top: 5px"><a href="javascript:void(0)"
                                                                                          style="color: #ed6c00"
                                                                                          onclick="deleteApplyFor(this,${branchApplyFor.id})">删除</a>
                                                            </p>
                                                        </td>
                                                    <#else>
                                                        <td class="tablelOperate"><p></p></td>
                                                    </#if>
                                                </tr>
                                            </#list>
                                            </tbody>
                                        </table>
                                    <#else>
                                        <div class="el-table__empty-block" style="height: 100%; width: 904px;">
                                            <span class="el-table__empty-text">暂无数据</span>
                                        </div>
                                    </#if>
                                <#else>
                                    <div class="el-table__empty-block" style="height: 100%; width: 904px;">
                                        <span class="el-table__empty-text">暂无数据</span>
                                    </div>
                                </#if>

                            </div>

                            <div class="el-table__column-resize-proxy" style="display: none;"></div>
                        </div>
                        <div id="test1" style="margin-top: 20px">

                        </div>
                    </div>
                </section>
            </div>
            <#--申请记录结束-->


        </div>
    </div>
</div>
<#include "../common/footer.ftl"/>

<script type="text/javascript" src="/home/layui/layui.all.js"></script>

<script>

    $("#applyFor").click(function () {
        if ($("#branchName").val() == "") {
            errorMsg("网点名称不能为空");
            return false;
        }
        if ($("#branchType").val() == "") {
            errorMsg("网点类型不能为空");
            return false;
        }
        if ($("#adminName").val() == "") {
            errorMsg("管理员姓名不能为空");
            return false;
        }
        if (!/(^[\u4E00-\u9FA5]+$)|(^[\u4E00-\u9FA5]*·[\u4E00-\u9FA5]*$)/.test($("#adminName").val())) {
            errorMsg("管理员姓名格式不正确");
            return false;
        }
        if ($("#idCard").val() == "") {
            errorMsg("身份证号不能为空");
            return false;
        }
        if (!msg.isCard($("#idCard").val())) {
            errorMsg("身份证号格式不正确");
            return false;
        }
        if ($("#mobile").val() == "") {
            errorMsg("手机号不能为空");
            return false;
        }
        if (!(/^1[3456789]\d{9}$/.test($("#mobile").val())) && !(/^0[\d]{2,3}-[\d]{7,8}$/.test($("#mobile").val()))) {
            errorMsg("手机号格式不正确");
            return false;
        }
        if ($("#queryPhone").val() == "") {
            errorMsg("查询电话不能为空");
            return false;
        }
        if (!(/^1[3456789]\d{9}$/.test($("#queryPhone").val())) && !(/^0[\d]{2,3}-[\d]{7,8}$/.test($("#queryPhone").val()))) {
            errorMsg("查询电话格式不正确");
            return false;
        }
        if ($("#address").val() == "") {
            errorMsg("省市区不能为空");
            return false;
        }
        if ($("#address").val().split('/').length != 3) {
            errorMsg("请选择完整的省市区");
            return;
        }
        if ($("#officeAddress").val() == "") {
            errorMsg("办公地址不能为空");
            return false;
        }
        if ($("#longitudeAndIatitude").val() == "") {
            errorMsg("经纬度不能为空");
            return false;
        }
        var formData = $("#applyForForm").serialize();
        $.ajax({
            url: "/admin/branches/applyFor",
            type: 'POST',
            data: formData,
            dataType: 'json',
            success: function (data) {
                if (data.code == 0) {
                    successMsg("申请提交成功");
                    setTimeout(function () {
                        window.location.replace("http://localhost:8080/system/index");
                    }, 1000);
                } else {
                    errorMsg(data.msg);
                }
            }
        });

    });


    layui.use('form', function () {
        var form = layui.form;
        form.on('submit(*)', function () {
            return false;
        });
    });


    var M = {};
    M.count = ${pageBean.total};
    M.curr = ${pageBean.currentPage};
    layui.use('laypage', function () {
        var laypage = layui.laypage;
        laypage.render({
            elem: 'test1' //注意，这里的 test1 是 ID，不用加 # 号
            , count: M.count //数据总数，从服务端得到
            , limit: ${pageBean.pageSize}
            , curr: M.curr
            , jump: function (obj, first) {
                //首次不执行
                if (!first) {
                    M.curr = obj.curr;
                    location.href = "/home/branch/index/?currentPage=" + obj.curr;
                }
            }
        });
    });


    function showApplyFor() {
        $("#applyForBox").show();
        $("#recordBox").hide();
        $("#showApplyFor").addClass("is-active").siblings().removeClass("is-active")
    }

    function showRecordBox() {
        $("#applyForBox").hide();
        $("#recordBox").show();
        $("#showRecordBox").addClass("is-active").siblings().removeClass("is-active")
    }

    $(document).ready(function () {
        var str = location.href;
        if (str.indexOf("currentPage") != -1) {
            showRecordBox();
        } else {
            showApplyFor();
        }
    });


    // 取消网点申请
    function deleteApplyFor(t, id) {
        $.ajax({
            url: '/home/branch/deleteApplyFor',
            type: 'POST',
            data: {id: id},
            dataType: 'json',
            success: function (data) {
                if (data.code == 0) {
                    successMsg("删除成功");
                    $(t).parents("tr").remove();
                } else {
                    errorMsg(data.msg);
                }
            }
        });
    }


    function lookInfo() {
        layer.open({
            type: 1 //Page层类型
            , area: ['400px', '240px']
            , title: '你好。'
            , shade: 0.6 //遮罩透明度
            , maxmin: true //允许全屏最小化
            , anim: 1 //0-6的动画形式，-1不开启
            , content: '<div style="padding:50px;">您的申请已通过，初始密码为123456，登录号为网点名称，请登录' +
                '<a style="color: #ed6c00" href="/system/login" target="_blank">网点后台</a>进行密码修改和操作</div>'
        });
    }


    function lookRejectReason(rejectReason) {
        layer.open({
            type: 1
            , area: ['400px', '240px']
            , shade: 0.6 //遮罩透明度
            , maxmin: true //允许全屏最小化
            , anim: 1 //0-6的动画形式，-1不开启
            , content: '<div style="padding:50px;">' + rejectReason + '</div>'
        });
    }


</script>
</body>
</html>